@charset "utf-8";



@keyframes md_slider{

    0% {margin-top: 0}
    20% {margin-top: 0}
    22% {margin-top: -250px}
    40% {margin-top: -250px}
    42% {margin-top: -500px}
    60% {margin-top: -500px}
    62% {margin-top: -750px}
    80% {margin-top: -750px}
    82% {margin-top: -1000px}
    98% {margin-top: -1000px}

}


.for_right_side_bar{
    width: 180px;
    float: right;
    height: 250px;
    background-color: aliceblue;

    overflow: hidden;
}



.slider{

    animation: md_slider 15s infinite;

}


.slider_img{

    float: right;

    width: 180px;
    height: 250px;

    background-position: center center;
    background-size: cover;
}










:root{

	--primary-color: #141418;
	--secondary-color: aliceblue;
	--secondary-color2 : rgb(14, 14, 15);
}

.light_mode{

	--primary-color: #dbdbde;
	--secondary-color: rgb(16, 16, 17);
	--secondary-color2 : rgb(212, 214, 152);

}

#button{

	height: 20px;
	width: 80px;

}







body{
	background-color: var(--primary-color);
	
}

#header_div{
	border: solid;
	background-color: cornsilk;
}
#header1{
	width: 100%;
	text-align: center;
	font-size: 20px;
}

#header2{
	width: 100%;
	background-color:white;
	border: double;
	height: 25px;
	text-align: center;
}

#div_for_header_margin{
	margin-top: 4px;	
}

.header_links{

    color: black;
}
.for_frame_div{
    width: 78%;
    height: 2300px;
    background-color:var(--secondary-color2);
    margin-left: 180px;
    border: double;
    border-color: beige;
}
.for_table{
    width: 1250px;
    height: 300px;
    margin-top: 20px ;
    text-align: center;
}
.for_images{
    max-width: 100%;
    max-height: 100% ;
}

.for_links{
    color: var(--secondary-color);
    font-size: 20px;
}

.for_left_side_bar{
    width:40px;
    float: left;
    margin-top: 600px;

}

.for_heading{
    width: 40%;
    height: 26px;
    background-color:#156486 ;
    border: double;
    border-color:bisque ;
}

.for_paragraph{

    color: var(--secondary-color);
}









.clock{

    background-color: black;
    width: 190px;
    height: 60px;
    border-radius: 20px;
    margin-left: 1500px;
}
.time{

    float: left;
    color: white;
    width: calc(100% / 3);
    text-align: center;
    margin-top: 6.5px;
    font-size: 18px;
}
.date{
    float: left;
    color: white;
    width: calc(100% / 3);
    text-align: center;
    margin-top: 6.5px;
    font-size: 18px;

}










